<template>
	    <view v-if="Object.keys(commentInfo).length!==0">
	        <view class="tit">
	            <view class="h">
	                <view class="h3">用户评价</view>
	            </view>
	            <view class="more">
	                 <text>更多</text>
	            </view>
	        </view>
	        <view class="comment">
	            <view class="userInfo">
	                <view class="userlogo"> <image :src="commentInfo.user.avatar"></image></view>
	                <view class="username">{{commentInfo.user.uname}}</view>
	            </view>
	            <view class="content">
	                <view class="p">{{commentInfo.content}}</view>
	                <view class="item">
	                    <text class="time">{{commentInfo.created || showDate}}</text>
	                    <text class="style">{{commentInfo.style}}</text>
	                </view>
	                <view class="img">
	                    <image :src="item" v-for="(item,index) in commentInfo.images" v-bind:key="index"></image>
	                </view>
	            </view>
	        </view>
	    </view>
</template>

<script>
	export default {
		props:{
			commentInfo:{
				type:Object,
				default:function (){
					return {}
				}
			}
		},
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style scoped>
.tit{
    display: flex;
    justify-content: space-between;
    padding: 16rpx 0;
}
.tit .h3{
    font-weight: normal;
}
.userInfo{
    display: flex;
}
.userInfo .userlogo{
    width: 100rpx;
    height: 100rpx;
}
.userInfo .userlogo image{
    max-width: 100%;
	height: 100rpx;
}
.userInfo  .username{
    height: 100rpx;
    line-height: 100rpx;
    margin-left: 30rpx;
}
.content .p{
    padding: 16rpx 0;
}
.item text{
    font-size: 24rpx;
}
.item .time{
    margin-right: 20rpx;
}
.content .img{
    width: 100%;
	height: auto;	
}
.content .img image{
	height: 563rpx;
	width: 100%;
}
</style>
